<template>
  <v-snackbar
    v-model="visible"
    multi-line :color="color" :timeout="timeout"
  >
    {{ content }}
    <template v-slot:actions>
      <v-btn icon="mdi-close-circle" @click="visible=false"></v-btn>
    </template>
  </v-snackbar>
</template>

<script setup lang="ts">
import { useVModel } from '@/hooks/useVModel';

const props=defineProps<{
  color:string;
  content:string;
  timeout:number;
  modelValue:boolean;
}>()
const emit=defineEmits<{
  (e: 'update:modelValue'): void;
}>()

const visible=useVModel(props,'modelValue',emit);
</script>

<style scoped>

</style>